根据坐标绘制热力图

啥也不说直接上代码

    Document

        body {

            margin: 0;

            padding: 0;

        }

        #map {

            width: 100vw;

            height: 100vh;

        }

        .a {

            height: 100px;

            width: 100px;

        }

        //获取本地文件数据数据

        var openFile = function (event) {

            var input = event.target;

            var reader = new FileReader();

            reader.onload = function () {

                if (reader.result) {

                    // 将文件内容转为数组样式

                    const list = reader.result.split("\n")

                    // 将数组转换成对象样式

                    const lista = list.map((item, index) => {

                        return {

                            lat: Number(item.slice(15, 24)),

                            lng: Number(item.slice(2, 12)),

                        }

                    })

                    // 坐标数据

                    var testData = {

                        max: 10,

                        data: lista

                    };

                    //热力图配置

                    var cfg = {

                        "radius": 4,

                        "maxOpacity": 0.8,

                        "scaleRadius": false,

                        "useLocalExtrema": false,

                        latField: 'lat',

                        lngField: 'lng',

                        valueField: 'count',

                    };

                    var heatmapLayer = new HeatmapOverlay(cfg);

                    //图层

                    var baseLayer = L.tileLayer(

                        'http://wprd0{s}.is.autonavi.com/appmaptile?x={x}&y={y}&z={z}&lang=zh_cn&size=1&scl=1&style=7', {

                        subdomains: '1234',

                        attribution: '...',

                        maxZoom: 18

                    }

                    );

                    // 初始化地图

                    var map = new L.Map('map', {

                        center: new L.LatLng(35.274507, 122.600289),

                        zoom: 10,

                        layers: [baseLayer, heatmapLayer],

                        scale: 8192

                    });

                    heatmapLayer.setData(testData);

                }

            };

            // 获取第几个文件  注意：只能同时获取一个文件

            reader.readAsText(input.files[0]);

        };